<template>
	<div class="header">
		<router-link :to="{name: 'root'}">
			<img src="../assets/cnodejs_light.svg" alt="">
		</router-link>
		<ul>
			<li><a href="#">首页</a></li>
			<li><a href="#">新手入门</a></li>
			<li><a href="#">API</a></li>
			<li><a href="#">关于</a></li>
			<li><a href="#">注册</a></li>
			<li><a href="#">登录</a></li>
		</ul>
	</div>
</template>

<script>
	export default {
		name: 'Header'
	}
</script>

<style scoped>
	.header {
		background-color: #5a5555;
		height: 50px;
		position: relative;
	}
	img {
		max-width: 120px;
		margin-left: 50px;
		margin-top: 10px;
	}
	ul {
		list-style: none;
		display: flex;
		position: absolute;
		right: 0;
		top: 0;
	}
	li {
		padding: 16px;
	}
	a {
		color: #ccc;
		font-size: 14px;
		text-decoration: none;
	}
</style>